/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

/*
 * Copyright (c) 2014, Joyent, Inc.
 */

#batch-action-preview {
  .alias { display: inline-block; }
  .item {
    margin-bottom: 10px;
    background: #f8f8f8;
    padding: 10px;
  }
}
#batch-progress {
  .alias { font-weight: bold; }
  .uuid { font-family: @font-family-monospace; }
  .item {
    background: #f8f8f8;
    padding: 10px;
    margin-bottom: 10px;
  }
  .execution {
    background: #333;
    padding: 4px 6px;
    color: #fff;
    text-align: center;
    display: inline-block;
    float: right;
    font-size: 10px;
    text-transform: uppercase;
  }
  .queued { background: @brand-warning; }
  .succeeded { background: @brand-success; }
  .running { background-color: @brand-success; color: #fff; }
  .canceled { background: @gray-light; }
  .failed { background: @brand-danger; }
}

.__vms-list {
  .vms-list-header {
    .make-row(0);
    background: @state-info-bg;
    .select {
      .make-xs-column(0.4, 0);
      padding: 10px 8px;
    }
    .title {
      .make-xs-column(6, 0);
      padding: 10px 15px;
    }
    .actions {
      color: #aaa;
      .make-xs-column(5, 0);
      padding: 10px 15px;
      text-align: right;
    }
  }

  table { margin-bottom: 20px; }
  caption { padding: 0; caption-side: bottom; }

  .owned-by {
    color: @gray-light;
    width: 240px;
    font-size: 12px;
  }
  .owner-name { cursor: pointer; margin-right: 5px;}
  .owner-company { display: inline-block; }

  .all {
    padding: 10px;
  }
  .more {
    padding: 10px;
  }
  .counters {
    font-size: 14px;
    padding: 10px;
  }

  td.status { width: 70px; }
  td.memory { width: 80px; text-align: right; padding-right: 30px; }
  .uuid {
    font-size: 10px;
    font-style: italic;
    display: block;
    color: @gray-light;
    font-family: monospace;
  }
  span.type {
    padding: 3px 4px;
    color: #FFF;
    font-weight: normal;
    text-transform: uppercase;
    background: #ccc;
    font-size: 8px;
    margin-top: -8px;
  }
  span.type.core {
    background: #6a6a6a;
  }
  span.type.docker {
    background: #00a8ff;
  }

  td.alias a { cursor: pointer; }

  td.ips {
    width: 130px;
    padding-right: 20px;
  }

  td.ips span {
    display: block;
    font-size: 12px;
    color: @gray;
    font-family: monospace;
  }

  th.package {
    width: 200px;
  }

  td.package-image {
    div { clear: both;}
    span { margin-left: 2px;}
    color: @gray;
    font-size: 12px;
  }

  .state {
    font-size: 10px;
    padding: 4px 6px;
    text-transform: uppercase;
    &.stopped { background-color: @gray-light; color: #fff; }
    &.failed { background-color: @brand-danger; color: #fff; }
    &.running { background-color: @brand-success; color: #fff; }
    &.destroyed { background-color: @gray-dark; color: #fff; }
  }
}
